<template>
    <div class="abolish">
        <div class="mask">
            <h3 class="f30">是否确定取消关注</h3>
            <div class="btn">
                <span @click="isShow(false, 0)">取消</span>
                <span @click="isShow(false, 1)">确定</span>
            </div>
        </div>
    </div>
</template>

<script>
    import Bus from '@/bus/bus.js'
    export default {
        name: 'abolish',
        props: {
            aboli: Object
        },
        data() {
            return {
                show: false
            }
        },
        methods: {
            isShow(bool, types) {
                this.show = bool;
                Bus.$emit('msg', {bools: bool, id: '', type: '3'})
                if(types) {
                    let params = {
                        "favoriteType": this.aboli.type,
                        "id[]": this.aboli.id,
                        "whycancel":'',
                        "userId": this.$store.state.userId
                    }
                    console.log(params)
                    this.$http.fetchGet('cancelFavorite', params).then(res => {
                        if(res.code == 200){
                            this.$vux.toast.text('已取消关注')
                        } else {
                            this.$vux.toast.text(res.msg)
                        }
                    }, err => {
                        console.log(err)
                    })
                }
            },
        },
        mounted() {

        }
    }
</script>

<style lang="less" scoped>
    .abolish{
        position: absolute;
        top: 0;
        bottom: 0;
        width: 100%;
        background: rgba(0, 0, 0, .3);
        z-index: 99;
        .mask{
            .w(500);
            .h(220);
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -70%);
            background: #fff;
            border-radius: 5px;
            h3{
                text-align: center;
                font-weight: normal;
                .mt(40);
            }
            .btn{
                position: absolute;
                bottom: 0;
                border-top: 1px solid #f2f2f2;
                width: 100%;
                .h(88);
                .lh(88);
                display: flex;
                span{
                    flex: 1;
                    text-align: center;
                    color: #189BEB;
                    &:nth-child(1){
                        border-right: 1px solid #f2f2f2;
                        color: #333;
                    }
                }
            }
        }
    }
</style>
